﻿<!DOCTYPE html PUBLIC "-//W3C//DTD XHTML 1.0 Transitional//EN" "http://www.w3.org/TR/xhtml1/DTD/xhtml1-transitional.dtd">
<html xmlns="http://www.w3.org/1999/xhtml">
<head>
    <link rel="stylesheet" href="../../Styles/jqx.apireference.css" type="text/css" />
    <script type="text/javascript" src="../../scripts/jquery-1.8.2.min.js"></script>
    <meta name="keywords" content="jQuery, Tooltip, jqxTooltip, tool tip, tip, title, popup" />
    <meta name="description" content="This page represents the help documentation of the jqxTooltip widget." />
    <title>jqxTouch API Reference</title>
    <script type="text/javascript">
        $(document).ready(function () {
            $(".documentation-option-type-click").click(function (event) {
                $(event.target).parents('tr').next().find(".property-content").toggle();
            });
        });
    </script>
</head>
<body>
    <div id="properties">
        <h2 class="documentation-top-header">
            Properties</h2>
        <table class="documentation-table">
            <tr>
                <th>
                    Name
                </th>
                <th>
                    Type
                </th>
                <th>
                    Default
                </th>
            </tr>
            <tr>
                <td class="documentation-option-type-click">
                    <span id='property-name-disabled'>swipeMin</span>
                </td>
                <td>
                    <span>Number</span>
                </td>
                <td>
                    50
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            Defines the minimum swipe distance required by the plugin.</p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Initialize a jqxTouch with the <code>swipeMin</code> property specified.
                        </p>
                        <pre><code>$('#jqxTouch').jqxTouch({swipeMin: 20});</code></pre>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="documentation-option-type-click">
                    <span id='Span1'>swipeMax</span>
                </td>
                <td>
                    <span>Number</span>
                </td>
                <td>
                    500
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            Defines the maximum swipe distance. After it is passed the propagation of the touch event will be restored, therefore the scrolling will be available.</p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Initialize a jqxTouch with the <code>swipeMax</code> property specified.
                        </p>
                        <pre><code>$('#jqxTouch').jqxTouch({swipeMax: 200});</code></pre>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="documentation-option-type-click">
                    <span id='Span2'>swipeDelay</span>
                </td>
                <td>
                    <span>Number</span>
                </td>
                <td>
                    1000
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            The swipe delay. After it is passed swipe event won't be fired..</p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Initialize a jqxTouch with the <code>swipeDelay</code> property specified.
                        </p>
                        <pre><code>$('#jqxTouch').jqxTouch({swipeDelay: 800});</code></pre>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="documentation-option-type-click">
                    <span id='Span3'>tapHoldDelay</span>
                </td>
                <td>
                    <span>Number</span>
                </td>
                <td>
                    750
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            The taphold delay. If this delay is passed then taphold event will be fired.</p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Initialize a jqxTouch with the <code>tapHoldDelay</code> property specified.
                        </p>
                        <pre><code>$('#jqxTouch').jqxTouch({tapHoldDelay: 600});</code></pre>
                    </div>
                </td>
            </tr>    
           <tr>
                <td class="documentation-option-type-click">
                    <span id='Span4'>orientationChangeEnabled</span>
                </td>
                <td>
                    <span>Boolean</span>
                </td>
                <td>
                    true
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            Indicates whether the orientationchange event is enabled..</p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Initialize a jqxTouch with the <code>orientationChangeEnabled</code> property specified.
                        </p>
                        <pre><code>$('#jqxTouch').jqxTouch({orientationChangeEnabled: false});</code></pre>
                    </div>
                </td>
            </tr>                                                               
            <tr>
                <td colspan='3' style='width: 100%'>
                    <h2 class="documentation-top-header">
                        Events</h2>
                </td>
            </tr>
            <tr>
                <td class="documentation-option-type-click">
                    <span id='Span27'>tap</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the user taps an element.
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the tap event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('tap', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
            <tr>
                <td class="documentation-option-type-click">
                    <span id='Span5'>taphold</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the user taps an element and holds a specific amount of time specified by the 'tapHoldDelay' property.
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the taphold event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('taphold', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
           <tr>
                <td class="documentation-option-type-click">
                    <span id='Span6'>swipe</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the user swipes left, right, up or down.
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the swipe event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('swipe', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
           <tr>
                <td class="documentation-option-type-click">
                    <span id='Span7'>swipeleft</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the user swipes left.
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the swipeleft event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('swipeleft', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
           <tr>
                <td class="documentation-option-type-click">
                    <span id='Span8'>swiperight</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the user swipes right.
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the swiperight event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('swiperight', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
                       <tr>
                <td class="documentation-option-type-click">
                    <span id='Span9'>swipetop</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the user swipes top.
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the swipetop event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('swipetop', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
                       <tr>
                <td class="documentation-option-type-click">
                    <span id='Span10'>swipebottom</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the user swipes bottom.
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the swipebottom event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('swipebottom', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
                       <tr>
                <td class="documentation-option-type-click">
                    <span id='Span11'>orientationchange</span>
                </td>
                <td>
                    <span>Event</span>
                </td>
                <td>
                </td>
            </tr>
            <tr>
                <td colspan='3' style='width: 100%'>
                    <div class="documentation-option-description property-content" style="display: none;">
                        <p>
                            This event is triggered when the device's orientation is changed. 
                        </p>
                        <h4>
                            Code examples</h4>
                        <p>
                            Bind to the orientationchange event by type: jqxTouch.
                        </p>
                        <pre><code>$('#element').bind('orientationchange', function () { // Some code here. }); </code></pre>
                    </div>
                </td>
            </tr>
        </table>
        <br />
    </div>
</body>
</html>
